<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>购物车</title>

    <script src="../js/shop.js" type="module"></script>

    <!-- 引入 bootstrap -->
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
        integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"
        integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous">
        </script>

    <link rel="stylesheet" href="../styles/css/shop.css">
    

</head>

<body>

    <!-- 头部导航 -->
    <nav>
        <div class="wrapper">

            <div class="nav-left">

                <a href="../html/index.html">欢太品牌</a>


                <a href="https://cloud.heytap.com/login.html?callback=https%3A%2F%2Fcloud.heytap.com%2F">欢太云服务</a>

                <a href="https://store.oppomobile.com/">软件商店</a>


                <a href="https://www.heythings-iot.com/health">健康</a>

            </div>

            <div class="nav-right">

                <a href="https://www.oppo.com/cn/download-storeapp/?utm_source=opposhopweb&utm_medium=header"
                    target="_blank" class="down-a">下载欢太商城app
                    <div class="down-logo">
                        <img src="../imgs/qrcode-v3.jpg" alt="">
                        <p>扫描下载欢太商城 APP</p>
                    </div>
                </a>



                <a
                    href="https://id.heytap.com/index.html?callback=https%3A%2F%2Fwww.heytap.com%2Fcn%2Fweb%2F&language=zh-CN&channelId=1000343">
                    <span class="glyphicon glyphicon-user"></span>
                    登录
                </a>


                <a
                    href="https://id.heytap.com/register.html?callback=https%3A%2F%2Fwww.heytap.com%2Fcn%2Fweb%2F&language=zh-CN&channelId=1000343">注册</a>


                <a
                    href="https://id.heytap.com/index.html?callback=https%3A%2F%2Fwww.heytap.com%2Fcn%2Fweb%2F&language=zh-CN&channelId=1000343">
                    <span class="glyphicon glyphicon-facetime-video"></span>
                    购物车（<i>0</i>）
                </a>

            </div>

        </div>
    </nav>

    <!-- 头部导航第二部分 -->
    <section class="nav2">
        <div class="wrapper">

            <div class="nav2_l">
                <a href="../html/index.html"><img src="../imgs/logo.png" alt="#" class="nav_logo"></a>
                <a href="https://www.heytap.com/cn/web/topic/700100.html" target="_blank">OPPO专区</a>
                <a href="https://www.heytap.com/cn/web/topic/700200.html" target="_blank">OnePlus专区</a>
                <a href="https://www.heytap.com/cn/web/topic/700300.html" target="_blank">realme专区</a>
                <a href="https://www.heytap.com/cn/web/topic/700400.html" target="_blank">智能生活</a>
                <a href="https://www.heytap.com/cn/web/topic/700500.html" target="_blank">潮流好物</a>
                <a href="https://www.heytap.com/cn/web/service">服务</a>
            </div>

            <div class="nav2_r">
                <input type="text" placeholder="OPPO Reno6星">
                <i class="glyphicon glyphicon-search"></i>
            </div>

        </div>
    </section>

    <!-- 主体部分 -->
    <main>
        <div class="wrapper">
            <div class="main1">
                <div>
                    全部商品 <span></span>
                </div>
                <div>
                    降价商品 <span></span>
                </div>
                <div></div>
            </div>
            <div class="main2">
                <div>
                    <span>商品信息</span>
                    <div>
                        <div></div>
                        <span>单价</span>
                        <span>数量</span>
                        <span>小计</span>
                        <span>操作</span>
                    </div>
                </div>
            </div>
            <div class="main3">
                <!-- <div class="main3-wrapper">
                    <div class="main3-l">
                        <div>
                            <input type="checkbox" name="" id="">
                        </div>
                        <div>
                            <img src="../imgs/list1-1.png" alt="">
                        </div>
                    </div>
                    <div class="main3-r">
                        <div class="main3-r-1">
                            <div class="shop-title">
                                <p>OPPO Reno6 5G 星黛紫 12G+256G</p>
                                <span>赠品|OPPO 半入耳式耳机 Type-C接口</span>
                            </div>

                            <div class="shop-d">
                                <div>¥3199</div>

                                <div>
                                    <button>-</button>
                                    <input type="num" min="1" max="10" value="1" class="shop-num">
                                    <button>+</button>
                                    <p>限购10件</p>
                                </div>

                                <div class="shop-sumprice">¥3199.00</div>
                                
                                <div>
                                    <div class="removeitem">删除商品</div>
                                    <div>修改商品</div>
                                </div>
                            </div>
                        </div>

                        <div class="main3-r-2">
                            <div>
                                <span>赠品</span>
                                <img src="../imgs/list1-12.png" alt="">
                                <div>OPPO 半入耳式耳机 Type-C接口</div>
                            </div>
                            <div>¥0</div>
                            <div>x1</div>
                        </div>

                    </div>
                </div> -->
            </div>
        </div>
    </main>

    <footer>
        <div class="wrapper">
            <div>
                <input type="checkbox" name="" id="">
                <span>全选</span>
            </div>
            <div>
                <div>
                    <span>合计</span>
                    <i>￥</i>
                    <b class="shop-allprice">3199.00</b>
                </div>
                <button type="submit">
                    去结算
                    <span class="shop-allsum">（1）</span>
                </button>
            </div>
        </div>
    </footer>
</body>

</html>